<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
        <link rel="stylesheet" href="css/style.css"/>
        <link href="assets/css/codemirror.css" rel="stylesheet">
        <link rel="stylesheet" href="assets/css/ace.min.css" />
        <link rel="stylesheet" href="Widget/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css">
        <link rel="stylesheet" href="assets/css/font-awesome.min.css" />

		<!--[if IE 7]>
		  <link rel="stylesheet" href="assets/css/font-awesome-ie7.min.css" />
		<![endif]-->
        <!--[if lte IE 8]>
		  <link rel="stylesheet" href="assets/css/ace-ie.min.css" />
		<![endif]-->
			<script src="assets/js/jquery.min.js"></script>
		<!-- <![endif]-->
		<!--[if IE]>
       <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <![endif]-->
		<!--[if !IE]> -->
		<script type="text/javascript">
			window.jQuery || document.write("<script src='assets/js/jquery-2.0.3.min.js'>"+"<"+"/script>");
		</script>
		<!-- <![endif]-->
		<!--[if IE]>
<script type="text/javascript">
 window.jQuery || document.write("<script src='assets/js/jquery-1.10.2.min.js'>"+"<"+"/script>");
</script>
<![endif]-->
        <script src="assets/js/ace-elements.min.js"></script>
		<script src="assets/js/ace.min.js"></script>
        <script src="assets/js/bootstrap.min.js"></script>
		<script src="assets/js/typeahead-bs2.min.js"></script>
        <script type="text/javascript" src="Widget/zTree/js/jquery.ztree.all-3.5.min.js"></script>
        <script src="js/lrtk.js" type="text/javascript" ></script>
<title>分类管理</title>
</head>

<body>
<div class=" clearfix">
 <div id="category">
    <div id="scrollsidebar" class="left_Treeview">
    <div class="show_btn" id="rightArrow"><span></span></div>
    <div class="widget-box side_content" >
    <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
     <div class="side_list">
      <div class="widget-header header-color-green2">
          <h4 class="lighter smaller">产品类型列表</h4>
      </div>
      <div class="widget-body">
          <div class="widget-main padding-8">
              <div  id="treeDemo" class="ztree"></div>
          </div>
  </div>
  </div>
  </div>
  </div>
<!---->
 <iframe ID="testIframe" Name="testIframe" FRAMEBORDER=0 SCROLLING=AUTO  SRC="product-category-add.php" class="page_right_style"></iframe>
 </div>
</div>
</body>
</html>
<script type="text/javascript">
var zNodes = null;
$(function() {
	$("#category").fix({
		float : 'left',
		//minStatue : true,
		skin : 'green',
		durationTime :false
	});

});
//初始化宽度、高度
 $(".widget-box").height($(window).height());
 $(".page_right_style").width($(window).width()-220);
  //当文档窗口发生改变时 触发
    $(window).resize(function(){
	$(".widget-box").height($(window).height());
	 $(".page_right_style").width($(window).width()-220);
	})
function createTree(zNodes) {
	var  tree = $("#treeDemo");
	var ul = $("<ul ></ul>");
	var len = zNodes.length;
	for(let i=0;i<len;i++){
	    var li = $("<li ><a  href='javascript:;' style='font-size:18px;margin-top:10px;' data-index='"+zNodes[i].id+"'>"+zNodes[i].zh_name+"</li>");
	    ul.append(li);
	}
	tree.append(ul);
}

$(document).ready(function(){
    $.ajax({
        url:"category/categoryQueryAll.php",
        type:"post",
        data:"",
        success:function(data){
            console.log(data);
            zNodes = data;
            createTree(zNodes);
        },
        datatype:"json"
	});
    $("#treeDemo").on('click','a',function(event){
        var id = $(event.target)[0].dataset.index;
        var index = null;
        var that = this;
        $.ajax({
                url:"category/categoryQueryAll.php",
                type:"post",
                data:"",
                success:function(data){
                    zNodes = data;
                    let len = zNodes.length; //$("#treeDemo").find("ul")[0].children.length;
                    console.log($(that).data("index"));
                    for(let i=0;i<len;i++){
                        if(zNodes[i].id===$(that).data("index")){
                            index = i ;
                        }
                    }
                    $("#testIframe").contents().find("#name").val(zNodes[index]["en_name"]);
                    $("#testIframe").contents().find("#zhname").val(zNodes[index]["zh_name"]);
                    //给更新按钮添加id属性
                    $("#testIframe").contents().find(".btn-success").eq(0).attr("data-index",zNodes[index]['id']);
                    $("#testIframe").contents().find(".btn-danger").eq(0).attr("data-index",zNodes[index]['id']);
                },
                datatype:"json"
        	});
    });
});
</script>